<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
	  	<base href="<%=basePath%>">
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>管理菜单</title>
		<link href="back/css/main.css" rel="stylesheet" type="text/css" />
		<script type="text/javascript" src="back/js/jquery-1.7.2.js"></script>
		<link type="text/css" rel="stylesheet" href="back/uploadify3.1/uploadify.css"></link>
		
		<style type="text/css">
			body {
				font: 12px/ 16px Arial, Helvetica, sans-serif;
			}
			#fileQueue {
				width: 500px;
				height: 300px;
				overflow: auto;
				border: 1px solid #E1E1E1;
				margin-bottom: 10px;
			}
			
		</style>
		<script src="back/uploadify3.1/jquery.uploadify-3.1.js" type="text/javascript"></script>
		<script src="back/uploadify3.1/swfobject.js" type="text/javascript"></script>
		
		<script type="text/javascript">
			function showResult() {//删除显示的上传成功结果   
				$("#result").html("");
			}
			
			$(document).ready(function() {
				$('#imageInput').uploadify( {
					'swf' : 'back/uploadify3.1/uploadify.swf',
					'uploader' : 'image_uploadify', //指定服务端处理类的入口 	
					'fileObjName' : 'imageInput', //和input的name属性值保持一致就好，Struts2就能处理了   
					'cancelImage' : 'back/uploadify3.1/uploadify-cancel.png',
					'queueID' : 'fileQueue',
					'auto' : false,//是否选取文件后自动上传   
					'multi' : true,//是否支持多文件上传 
					'preventCaching' : true,
					'uploadLimit' :100,//一次同步上传的文件数目   
					'fileTypeDesc' : '支持格式:jpg/gif/jpeg/png/bmp.', //如果配置了以下的'fileExt'属性，那么这个属性是必须的 
					'fileTypeExts' : '*.jpg;*.gif;*.jpeg;*.png;*.bmp',//允许的格式
					'queueSizeLimit':100,
					'fileSizeLimit' : 5120000, //单位为字节
					'buttonText' : '增加上传文件',//按钮上的文字   
					'percentage' : 'percentage',//有speed和percentage两种，一个显示速度，一个显示完成百分比    
					'onUploadError' : function(event, ID, fileObj, errorObj) {
						if (errorObj.type === "File Size") {
							alert('超过文件上传大小限制,文件会被自动清除！');
							$('#imageInput').uploadifyClearQueue(ID);
						}
					},
					'onSelectError': function() {  //清除一个的时候.对应的循序清楚数组中的，后面的向前赋值。
						alert('图片 ' + file.name + ' 出错，请重新添加');
		    		 },
					'onUploadComplete' : function(event, queueID, fileObj, response, data) {
					   	$("#result").html(response); 					//显示上传成功结果
					    setInterval("showResult()", 2000); 				//两秒后删除显示的上传成功结果 
					}
	
				});
	
			});

		</script>
				
		
	</head>

	<body>
		
		<div style="padding-top: 10px; padding-left: 0px; padding-right: 5px;">
			<form action="image_add.action" method="post">
				
				<table class="table" cellspacing="1" cellpadding="2" width="100%" align="center" border="0">
					
					
					<tr>
						<th class="bg_tr" align="left" colspan="2" height="35">
						&nbsp;
						<input type="button" value="新增图片" onClick="javascript:window.location.href='/banner_add.system?flag=1';" />
						<input type="button" value="管理图片" onClick="javascript:window.location.href='/banner_manager.system?flag=1';" />
						</th>
					</tr>
					<s:if test="navList!=null">
						<tr>
							<td height="44" align="right" class="td_bg">所属模块：</td>
							<td class="td_bg">
								&nbsp;
								<select name="parentId" id="parentId">
									<option value="0" selected>&nbsp;&nbsp;└&nbsp;请选择：</option>
									<option value="nav.navId" >&nbsp;&nbsp;└&nbsp;<s:property value="nav.title" /></option>
									<s:iterator value="navList" id="nl">
										<option value="<s:property value='#nl.navId' />">
											&nbsp;&nbsp;&nbsp;&nbsp;└&nbsp;<s:property value='#nl.title' />
										</option>
									</s:iterator>
								</select>
								&nbsp;<span id="parentIdTip" style="height: 22px;"></span>
							</td>
						</tr>
					</s:if>
					<tr>
						<td width="13%" height="41" align="right" class="td_bg">
							图片附件：
						</td>
						<td class="td_bg" width="87%">
							<div id="result"></div>
		
							<div id="fileQueue"></div>
							<input type="file" name="imageInput" id="imageInput" />
							<br />
							<br />
							<a href="javascript:$('#imageInput').uploadify('upload','*');">开始上传</a>
							&nbsp;&nbsp;&nbsp;
							<a href="javascript:$('#imageInput').uploadify('cancel','*');">取消上传队列</a>
							<br />
							<br />
						</td>

					</tr>
					
					<tr>
						<td width="13%" height="41" align="right" class="td_bg">图片标题：</td>
						<td class="td_bg" width="87%">
							<input value="" id="title" name="imageInfo.title" style="width: 200px;" tabindex="1" />
							&nbsp;<span id="titleTip" style="height: 22px;">* 图片的标题</span>	
						</td>
					</tr>
					<tr>
						<td width="13%" height="41" align="right" class="td_bg">图片简介：</td>
						<td class="td_bg" width="87%">
							<textarea rows="10" cols="80" name="imageInfo.info"></textarea>
							&nbsp;<span id="urlTip" style="height: 22px;">* 图片简介</span>	
						</td>
					</tr>
					<tr>
						<td width="13%" height="44" align="right" class="td_bg"><span class="TableRow2"><b></b> </span></td>
						<td class="td_bg" width="87%">
							&nbsp;
							<input type="submit" value="确认添加" />
							<input type="reset"  value="重新填写" />
						</td>
					</tr>
				</table>
			</form>

		</div>

	</body>
</html>


